---
import { Tabs, TabItem } from '@astrojs/starlight/components';
---

<Tabs syncKey="ui-frameworks">
	{
		Astro.slots.has('preact') && (
			<TabItem label="Preact">
				<slot name="preact" />
			</TabItem>
		)
	}
	{
		Astro.slots.has('react') && (
			<TabItem label="React">
				<slot name="react" />
			</TabItem>
		)
	}
	{
		Astro.slots.has('solid') && (
			<TabItem label="Solid">
				<slot name="solid" />
			</TabItem>
		)
	}
	{
		Astro.slots.has('svelte') && (
			<TabItem label="Svelte">
				<slot name="svelte" />
			</TabItem>
		)
	}
	{
		Astro.slots.has('vue') && (
			<TabItem label="Vue">
				<slot name="vue" />
			</TabItem>
		)
	}
	{
		Astro.slots.has('lit') && (
			<TabItem label="Lit">
				<slot name="lit" />
			</TabItem>
		)
	}
</Tabs>
